import React, {
} from 'react';
import {
  View,
  Text,
  Image,
} from 'react-native';

import PropTypes from 'prop-types'

const propTypes = {
  selected: PropTypes.bool,
  title: PropTypes.string,
  inactive: PropTypes.number,
  active : PropTypes.number
};

const TabIcon = (props) => {

  var iconPath = !props.focused ? props.inactive : props.active;
  const color = !props.focused ? "#727171" : "#897854";
  
  return (
    <View style={{flex:1, flexDirection:'column', alignItems:'center', alignSelf:'center', justifyContent: 'center'}}>
      <Image
        style={{width: 25, height: 25}}
        source={iconPath}
      />
      <Text style={{color: color, fontSize: 10, paddingTop: 0}}>{props.title}</Text>
    </View>
  );

};

TabIcon.propTypes = propTypes;

export default TabIcon;